<template>
    <van-list
            v-model="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="loadData"
    >
        <van-cell-group class="wdp-2-4">
            <van-cell>
                <h3>待处理事项</h3>
            </van-cell>
            <van-cell v-for="task in dataSource" :key="task.id"
                      :icon="task.passRound ? 'circle' : 'star-o'"
                      @click="$emit('detailFromTask', task.id)">
                <template #title>
                    <h4>{{task.taskTitle}}</h4>
                </template>
                <template #label>
                    <p>发送人：{{task.fromUserName}}</p>
                    <p>发送时间：{{task.sendTimeString}}</p>
                </template>
            </van-cell>
        </van-cell-group>
    </van-list>
</template>

<script>

    export default {
        name: 'taskList',
        props: {
            refresh: Boolean,
        },
        data() {
            return {
                pageNo: 1,
                pageSize: 10,
                loading: false,
                finished: false,
                dataSource: [],
                url: {
                    list: '/api/bpm/bpm-front/taskRest/list/v1',
                }
            }
        },
        methods: {
            reload() {
                //页面刷新
                this.pageNo = 1;
                this.finished = false;
                this.dataSource = [];
                this.loading = true;
                this.loadData();
            },
            loadData() {
                this.$mask.open();
                this.$http.get(this.url.list, {
                    params: {
                        pageNo: this.pageNo,
                        pageSize: this.pageSize,
                    }
                }).then((res) => {
                    this.finished = res.result.total <= this.pageSize * this.pageNo;
                    this.pageNo++;
                    this.dataSource = [
                        ...this.dataSource,
                        ...res.result.records
                    ];
                }).catch((err) => {
                    this.$notify({type: 'warning', message: '请求失败: ' + err, duration: 2000,});
                }).finally(() => {
                    this.loading = false;
                    this.$mask.close();
                });
            }
        },
        watch: {
            refresh: {
                handler(value) {
                    if (!value) {
                        this.reload();
                    }
                },
                immediate: true
            }
        }
    }
</script>
